<html xmlns:th="http://www.thymeleaf.org" lang="en">
<head>
    <title>OAuth 2.0 Client</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1"/>
    <link href="../static/css/bootstrap.css" rel="stylesheet" th:href="@{/css/bootstrap.css}"/>
</head>
<body>

<div class="container-fluid">

    <h1>OAuth 2.0 Client Callback</h1>

    <div class="progress" style="height: 50px;">
        <div class="progress-bar" role="progressbar" style="width: 66%;" aria-valuenow="66" aria-valuemin="0"
             aria-valuemax="100"><strong>Step 2: Exchange authorization code for access token</strong></div>
    </div>

    <hr>
    <div class="jumbotron">

        <ul>
            <li th:text="'authorization-code:' + ${code}"></li>
            <li th:text="'state:' + ${state}"></li>
        </ul>
    </div>
    <hr>
    <div class="jumbotron">
        <h2>Token Request</h2>

        <p th:utext="${token_request}"></p>

        <a class="btn btn-primary" role="button" th:href="@{'/tokenrequest?code=' + ${code} + '&state=' + ${state}}"
           href="#">Request Token</a>
    </div>
</div>

<script src="../static/js/jquery.min.js"></script>
<script src="../static/js/popper.min.js"></script>
<script src="../static/js/bootstrap.js" th:href="@{/js/bootstrap.js}"></script>

</body>
</html>
